<template>
    <view class="m20">
        <uv-cell-group :border="false" :customStyle="{ background: '#fff', borderRadius: '0rpx' }">
            <uv-cell :border="true" title="乡镇名称" :value="formData.Town"></uv-cell>
            <uv-cell :border="true" title="发生时间" value="">
                <template v-slot:value>
                    {{ formData.Fssj.replace("T", " ") }}
                </template>
            </uv-cell>
            <uv-cell :border="true" title="位置" :value="formData.Place"></uv-cell>
            <uv-cell :border="true" title="经度" :value="formData.Lon"></uv-cell>
            <uv-cell :border="true" title="纬度" :value="formData.Lat"></uv-cell>
            <uv-cell :border="true" title="地质灾害类型" :value="dzzhList[formData.Zhlx]"></uv-cell>
            <uv-cell :border="true" title="是否在1:10000中高分险区" :value="radiolist[formData.Gfxq]"></uv-cell>
            <uv-cell :border="true" title="是否为切坡建房点" :value="radiolist[formData.Qpjf]"></uv-cell>
            <uv-cell :border="true" title="是否为成功避险" :value="radiolist[formData.Cgbr]"></uv-cell>
            <uv-cell :border="true" title="是否在册隐患" :value="radiolist[formData.ZcYhd]"></uv-cell>
            <uv-cell :border="true" title="引发因素" :value="yfysList[formData.Yfys]"></uv-cell>
            <uv-cell :border="true" title="填表人" :value="formData.Tbr"></uv-cell>
            <uv-cell :border="true" title="情况说明" value="">
                <template v-slot:label>
                    <uv-textarea :customStyle="{
                        background: '#edf2fa',
                        border: 'none',
                        marginTop: '20rpx',
                    }" placeholder="" disabled v-model="formData.Remark"></uv-textarea>
                </template>
            </uv-cell>
            <uv-cell :border="true" title="速报照片" value="">
                <template v-slot:label>
                    <view class="df ac mt-10">
                        <view v-for="(item, index) in formData.FileIds" :key="index" class="mr-10">
                            <uv-image :src="item" radius="12rpx" width="200rpx" height="200rpx" @click="onImg(index)">
                                <template v-slot:error>
                                    <view style="font-size: 24rpx;">加载失败</view>
                                </template>
                            </uv-image>
                        </view>
                    </view>
                </template>
            </uv-cell>
        </uv-cell-group>
        <uv-gap height="20rpx"></uv-gap>
    </view>
    <lh-submit title="审批提交" v-if="formOperType != SYSFORMOPERTYPE.View"></lh-submit>

</template>

<script lang="ts" setup>
import { GetZqsbDetail_API } from '@/server/home';
import { SYSFORMOPERTYPE } from '@/utils/enum';
const formOperType = ref()
onLoad((e) => {
    if (e.id) initTask(e.id);
    formOperType.value = e.optype || SYSFORMOPERTYPE.Add;
    console.log("formOperType.value :", formOperType.value);
})
const dzzhList = {
    1: "崩塌",
    2: "泥石流",
    3: "地面塌陷",
    4: "其他",
}
const radiolist = {
    1: "是",
    0: "否",
}
const yfysList = {
    0: "自然因素",
    1: "人为因素",
}
const formData = ref({
    TownCode: '',
    Town: '',
    Place: '',
    Lon: '',
    Lat: '',
    Fssj: '',
    Fsgm: 0,
    yhgm: 0,
    Ssrs: 0,
    Swrs: 0,
    Jjss: 0,
    shfw: 0,
    shtd: 0,
    Wxhs: 0,
    Wxrs: 0,
    Wxcc: 0,
    Cgbr: '',
    Tbr: '',
    Remark: '',
    FileIds: [],
    Zhlx: '',
    Gfxq: '',
    Qpjf: '',
    ZcYhd: '',
    Yfys: '',
    LonLat: '',
})
const initTask = async (id) => {
    const res = await GetZqsbDetail_API(id)
    if (res.IsSuccess) {
        formData.value = res.Data
        formData.value.FileIds = res.Data.FileIds?.map(el => import.meta.env.LH_FILE_BASEURLDZFZ + el)
    }
}
// 图片预览
const onImg = (index) => {
    uni.previewImage({
        urls: formData.value.FileIds,
        indicator: "number",
        current: index,
    })
}
</script>

<style lang="scss" scoped>
page {
    background: #f5f5f5;
}
</style>